<template>
	<view>
		<u-navbar :background="background" :borderBottom="false">
			<view class="ft_16 fw-b">
				拼单商城
			</view>
		</u-navbar>
		<view class="content">
			<u-waterfall v-model="shopList">
				<template v-slot:left="{leftList}">
					<shop v-for="(item,index) in leftList" :key="index" :shopimg="item.image" :shopname="item.name" :oldprice="item.market_price" :newprice="userInfo.role_type==0 ? item.prices:userInfo.role_type==1 ? item.prices1:userInfo.role_type==2?item.prices2:item.prices3" :man="item.activity" :yuexiao="item.sales" @click.native="go_shopList(item,index)"></shop>
				</template>
				<template v-slot:right="{rightList}">
					<view class="display" style="align-items: flex-end;flex-flow: column;">
						<shop v-for="(item,index) in rightList" :key="index" :shopimg="item.image" :shopname="item.name" :oldprice="item.market_price" :newprice="userInfo.role_type==0 ? item.prices:userInfo.role_type==1 ? item.prices1:userInfo.role_type==2?item.prices2:item.prices3" :man="item.activity" :yuexiao="item.sales" @click.native="go_shopList(item,index)"></shop>
					</view>
				</template>
			</u-waterfall>
			<!-- <view class="display just_space tuijian" style="flex-flow: wrap;">
				<shop v-for="(item,index) in shopList" :key="index" :shopimg="item.image" :shopname="item.name" :oldprice="item.market_price" :newprice="userInfo.role_type==0 ? item.prices:userInfo.role_type==1 ? item.prices1:userInfo.role_type==2?item.prices2:item.prices3" :man="item.activity" :yuexiao="item.sales" @click.native="go_shopList(item,index)"></shop>
			</view> -->
			
		</view>
		
	</view>
</template>

<script>
	import shop from "../../../../components/shop.vue"
	export default {
		data() {
			return {
				userInfo:"",//用户信息
				background:{backgroundColor: '#ffffff',},
				
				shopList:[], //商品列表
				page:1, //默认页数
				
			}
		},
		components:{
			shop
		},
		onLoad() {
			this.userInfo=this.$all.getData('userInfo') //获取用户信息
			console.log(this.userInfo);
			this.getshopList(1) //获取商品列表
		},
		onReachBottom() {//触底获取商品
			this.page+=1
			console.log(this.page);
			this.getshopList(this.page) 
		},
		methods: {
			getshopList(page){ //获取商品列表
				this.$myRequest('goods/groupList',{
					page:page,
				}).then(res=>{
					console.log(res.data);
					let data=res.data.data
					this.shopList.push(...data.grouplist)
					console.log(this.shopList);
				})
			},
			
			go_shopList(item,index){ //去商品详情
				console.log(index);
				uni.navigateTo({
					url:"pindanDetail?shopid="+item.id
				})
			},
			
		}
	}
</script>

<style lang="scss">
page{
	background-color: #fafafa;
}
.content{
	padding: 15px;
	.options{
		padding: 10px 0;
		.option{
			padding-right: 25px;
		}
	}
}

</style>
